{extend name="../../base/view/common/base" /}
<!-- 主体 -->
{block name="style"}
<link rel="stylesheet" href="{__STATIC__}/layui/plugin/dtree/dtree.css">
<link rel="stylesheet" href="{__STATIC__}/layui/plugin/dtree/font/dtreefont.css">
<link rel="stylesheet" href="{__STATIC__}/mdeditor/css/editormd.min.css?v=1.0.2">
{/block}
{block name="breadcrumb"}
<span class="layui-breadcrumb">
  <a href="https://www.gougucms.com/" target="_blank">勾股DEV</a>
  <a><cite>项目中心</cite></a>
</span>
{/block}
{block name="body"}
<div class="table-content p-3">
	<div class="layui-form-bar border-t border-x">
		<button class="layui-btn layui-btn-sm layui-btn-normal add-new">+ 新建项目</button>
	</div>
	<table class="layui-hide" id="test" lay-filter="test"></table>
</div>

<script type="text/html" id="barDemo">
<div class="layui-btn-group"><a class="layui-btn layui-btn-xs" href="/project/index/view?id={{d.id}}">项目情况</a><span class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit">修改</span></div>
</script>
{/block}
<!-- /主体 -->

<!-- 脚本 -->
{block name="script"}
<script src="{__STATIC__}/mdeditor/editormd.min.js"></script>
<script>
	function init(layui){
		var table = layui.table,form = layui.form,gougu = layui.gougu;
		layui.pageTable = table.render({
			elem: '#test',
			title: '项目列表',
			cellMinWidth:200,
			page: true, //开启分页
			limit: 20,
			url: "/project/index/index", //数据接口
			cols:  [[
				{field:'id', title: '项目编号',width: 80, align:'center',fixed:'left',rowspan: 2,templet:function(d){
					return 'M'+d.id;
				}}
				,{field:'status',title: '状态',align:'center',width: 60,rowspan: 2,templet:function(d){
					var html = '<span class="layui-btn layui-btn-xs bg-status-'+d.status+'">'+d.status_name+'</span>';
					return html;
				}}
				,{field:'name',title: '项目名称',rowspan: 2}
				,{field:'director_name',title: '项目负责人', align:'center',width: 90,rowspan: 2}
				,{field:'plan_time',title: '项目周期', align:'center',width: 200,rowspan: 2}
				,{align: 'center', title: '关联需求', colspan: 3}
				,{align: 'center', title: '关联任务', colspan: 3}
				,{align: 'center', title: '关联BUG', colspan: 3}

				,{fixed: 'right',title: '操作',align: 'center',width: 120,rowspan: 2,toolbar: '#barDemo',}
			], [
				{field:'requirements_a',align:'center', style:'color: #91CC75;', width:80,'title':'进行中'}
				,{field:'requirements_b',align:'center', style:'color: #FAC858;', width:80,'title':'已完成'}
				,{field:'requirements_c',align:'center', style:'color: #EE6666;', width:80,'title':'完成率'}
				,{field:'tasks_a',align:'center',style:'color: #91CC75;', width:80,'title':'进行中'}
				,{field:'tasks_b',align:'center',style:'color: #FAC858;', width:80,'title':'已完成'}
				,{field:'tasks_c',align:'center', style:'color: #EE6666;', width:80,'title':'完成率'}
				,{field:'bugs_a',align:'center',style:'color: #91CC75;', width:80,'title':'进行中'}
				,{field:'bugs_b',align:'center',style:'color: #FAC858;', width:80,'title':'已完成'}
				,{field:'bugs_c',align:'center', style:'color: #EE6666;', width:80,'title':'修复率'}
			]]
		});
		
		$('.add-new').on('click',function(){
			gougu.open('/project/index/add');
		});
		
		//监听行工具事件
		table.on('tool(test)', function(obj) {
			var data = obj.data;
			if (obj.event === 'edit') {
				gougu.open('/project/index/edit?id='+data.id);
				return;
			}
		});
	}		
</script>
{include file="../../base/view/common/layui" base='base' extend="['gougu','employeepicker','gouguEdit','gouguComment']" callback="init" /}
{/block}
<!-- /脚本 -->